<title>Login</title>
<meta charset="${_response_encoding}">
<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/main.css'}">
#{get 'moreStyles' /}
<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/bootstrap/css/bootstrap.min.css'}">
<link rel="shortcut icon" type="image/png" href="@{'/public/images/favicon.png'}">
<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/jquery-ui-1.10.3.custom/css/start/jquery-ui-1.10.3.custom.css'}">
<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/jquery-ui-1.10.3.custom/css/start/jquery-ui-1.10.3.custom.min.css'}">

<script src="@{'/public/javascripts/jquery-1.10.1.js'}" type="text/javascript" charset="${_response_encoding}"></script>
#{get 'moreScripts' /}
<script src="@{'/public/javascripts/bootstrap/bootstrap.js'}" type="text/javascript" charset="${_response_encoding}"></script>
<script src="@{'/public/stylesheets/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.js'}" type="text/javascript" charset="${_response_encoding}"></script>
<script src="@{'/public/stylesheets/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js'}" type="text/javascript" charset="${_response_encoding}"></script>

<script>
$(document).ready(function () {
    var userData;

    var getUser = function () {
        $.ajax({
            dataType: "json",
            type: 'GET',
            data: '',
            async: false,
            url: "/currentUser",
            success: function (data) {
                userData = data;
            }
        });
    } 
    $('#submitForm').click(function () {

        var username = $("#usuario").val();
        var password = $("#password").val();

        if (username != "" && password != "")
                $.ajax({
                    type: 'POST',
                    url: '/authentication',
                    async: false,
                    data: {
                        username: username,
                        password: password
                    },
                    success: function (data) {
                        if (data.success) {
                        	console.log(data)
                            getUser();
                            window.location = "/index";
                        } else {
                        	console.log(data)
                            $("#login-error").html("<a class='close' data-dismiss='alert'>x</a><strong>Error!</strong> The username or password you entered were incorrect ").show();
                        }

                    },
                    error: function (xml, msg) {
                        console.log("error");
                    }
                });
                return false;
    });

    $("#password").bind('keypress', function (event) {
        if (event.which == 13) {
            $('#submitForm').trigger('click');

        }
    });
});

function validateEmail(email) {
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    if (!emailReg.test(email)) {
        return false;
    } else {
        return true;
    }
}



</script>

<body class="bodylogin" >
	<br><br><br>
	<center><br><br><br>
	<div class="cabeza"></div>
	<div class="contenido">
		
		<table border="0" align="center" width="100%">
			<tr>
		    	<td colspan="1" align="center" width="25%">
		        	<img src = "/public/images/econsa-logo.png" border = "0">
				</td>
				<td colspan="1" align="center" width="50%">
					<font style="color: #333333; font-family: Century Gothic, sans-serif; font-size:24px;">Sistema de Información Gerencial</font><br>
					<font style="color: #333333; font-family: Century Gothic, sans-serif; font-size:22px;">de Cotización de Proyectos de Construcción</font> <br>
					<font style="color: #333333; font-family: Century Gothic, sans-serif; font-size:22px;">para Econsa Constructores SA de CV</font> <br>
				</td>
			</tr>
		</table>						
		<br><br><br>
		<table border="0" cellpadding="1" cellspacing="5" width="60%" align="center">
			<tr>
				<td><label class="control-label" for="inputUsuario">Usuario</label></td>
				<td>
					<div class="controls">
						<input type="text" id="usuario" name="usuario" placeholder="Usuario">
					</div>
				</td>
				<td rowspan="3" align="center"><img src="/public/images/login.png" border="0"></td>
			</tr>
			<tr>
				<td>
					<label class="control-label" for="inputPassword">Password</label>
				</td>
				<td>
					<div class="controls">
						<input type="password" id="password" name="password" placeholder="Password">
					</div>
				</td>
			</tr>
			<tr>
	    		<td colspan="2" align="center">
	            	<div class="controls">
						<button type="button" id="submitForm" class="btn">Aceptar</button>
						<button type="reset" class="btn">Cancelar</button>
					</div>
				</td>
			</tr>
			<tr>
				<td colspan="3" align="center">
					<br/>
	            	<div id="login-error" class="alert alert-block alert-error fade in" style="display: none; margin-top: 15px;"></div>
				</td>
			</tr>                                
			<tr>
				<td colspan="3" align="center">
					<b><font size="1">ECONSA CONSTRUCTORES S.A DE C.V</font></b></br></br>
					<b><font size="1">&copy; DERECHOS RESERVADOS</font></b>
				</td>
			</tr>
		</table>						
	</div>
	<div class="pie"></div>
	</center>
</body>